<%--
  Created by IntelliJ IDEA.
  User: FHJ
  Date: 2022/11/30
  Time: 19:13
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>民宿推荐</title>


    <link rel="stylesheet" href="${pageContext.request.contextPath}/bootstrap-3.4.1-dist/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/bootstrap-3.4.1-dist/css/bootstrap-theme.min.css"/>


    <script src="${pageContext.request.contextPath}/bootstrap-3.4.1-dist/js/jquery-3.3.1.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>

    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/product_page.css">
    <link rel="stylesheet"  href="${pageContext.request.contextPath}/layui/css/layui.css">

</head>
<body style="background-color: #c2bfbf;">
<form>
    <ul class="layui-nav"  lay-bar="disabled">

        <li class="layui-nav-item other"><a href="${pageContext.request.contextPath}/index/1">首页</a></li>
        <li class="layui-nav-item layui-this"><a href="">订酒店</a></li>
        <li class="layui-nav-item"><a href="">旅游攻略</a></li>
        <li class="layui-nav-item">
            <div>

                <a href=""><span class="layui-icon layui-icon-search" style="font-size: 30px; color: #1E9FFF;"></span></a>
                <input type="text">

            </div>
        </li>

        <li class="layui-nav-item login" lay-unselect>
            <a href="${pageContext.request.contextPath}/customer/1?"><img src="${pageContext.request.contextPath}/img/headpicture.jpg" class="layui-nav-img">
            </a>
        </li>

    </ul>
</form>
<div class="container">




    <div class="row banner">
        <div class="col-md-12">
            <img src="${pageContext.request.contextPath}/img/fu.jfif" />
        </div>


        <div class="main">
            <ul>
                <c:forEach var="product" items="${productList}">
                    <li>
                        <a href="${pageContext.request.contextPath}/product/${product.proId}">
                            <img src="${pageContext.request.contextPath}/${product.proImg}" />
                            <p>${product.proName}</p>
                            <span class="price">￥${product.proPrice}</span>
                        </a>
                    </li>
                </c:forEach>
            </ul>

        </div>



    </div>


</div>

<script>
    // 这里开始是开头导航栏
    layui.use('element', function(){
        var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块

        //监听导航点击
        element.on('nav(demo)', function(elem){
            //console.log(elem)
            layer.msg(elem.text());
        });
    });

</script>



</body>
</html>
